import { Component } from 'vue-facing-decorator'
import Render from '@/render/Render'
import toNative from '@/utils/toNative'
import TableRender, { type TableRenderColumnTypes } from '@/render/TableRender'
import type { FilterDto } from '@/render/FilterRender'
import type { VxeTableDataRow } from 'vxe-table'
import DetailDrawer from './components/detail/Index'
import { getInsurancePeriodDispatchingUnit } from '@/api/insurance/serveCompany/index'
import type { AnyObject } from 'ant-design-vue/es/_util/type'
import { InsurePeriodServeCompanyStatusCnEnum, OccupationStatusCnEnum } from '@/const/enum'
@Component
export class DispatchingCompanyView extends TableRender {
    pageTitle = '长期保'
    showDetailDrawer = false
    filterConfig() {
        return {
            serveCompanyOrCompanyName: {
                name: '',
                element: 'input',
                placeholder: '智能搜索派遣单位或客户产品名称'
            },
            // companyId: {
            //     name: '派遣单位',
            //     element: 'input',
            // },
        } as FilterDto
    }
	
    tableColumnConfig() {
        return [
            {
                field: 'operate',
                title: '可用工种',
                width: 150,
                params: {
                    buttons: [
                        {
                            text: '查看详情',
                            event: (row) => this.onToDetail(row)
                        },
                    ]
                },
                slots: {
                    default: 'buttons'
                }
            },
            // {
            //     field: 'company',
            //     title: '可用工种',
            //     width:160,
            //     slots: {
            //         default: (row) => { 
            //             return <div class="text-blue-100 cursor-pointer">点击查看</div>
            //         }
            //     }
            // },
            {
                field: 'serveCompanyName',
                title: '派遣单位',
                width: 200,
            
            },
            {
                field: 'companyName',
                title: '客户名称',
                slots: {
                    default: 'toNext'
                },
                params: {
                    path:(row) => {
                        return `/customer/${row.companyId}`
                    },
                },
            },
            {
                field: 'specialAppoint',
                title: '特别约定',
            },
            {
                field: 'address',
                title: '单位地址',
            },
            {
                field: 'status',
                title: '状态',
                formatter: ({row}) => {
                    return InsurePeriodServeCompanyStatusCnEnum[row.status]
                }
            },
            {
                field: 'lastApplyOccupationTime',
                title: '最新申请时间',
                width: 160
            },
        // {
        //     field: 'operate',
        //     title: '操作',
        //     width: 160,
        //     fixed: 'right',
        //     params: {
        //         buttons: [
        //             {
        //                 text: '通过',
        //                 event: (row) => {}
        //             },
        //             {
        //                 text: '拒绝',
        //                 event: (row) => {}
        //             },
        //         ]
        //     },
        //     slots: {
        //         default: 'buttons'
        //     }
        // }
        ] as TableRenderColumnTypes<VxeTableDataRow>
    }

    onToDetail(row: VxeTableDataRow) {
        this.$router.push({
            path: `/insurance-center/dispatching-company/${row.id}`
        })
    }
	
    onLoadData(page: number, size: number, filters: { serveCompanyOrCompanyName:string }) {
        return getInsurancePeriodDispatchingUnit({
            pageNum: page,
            pageSize: size,
            ...filters
        })
    }

    render() {
        return <>
            <DetailDrawer
                v-model:show={ this.showDetailDrawer }
            />
            {super.render()}
        </>
    }
}

export default toNative<{}, {}>(DispatchingCompanyView)